import React from 'react';
import { Link } from 'react-router-dom';
import { Menu, Icon, Button } from 'antd';
import PropTypes from 'prop-types';

class UserStatus extends React.Component {
  constructor() {
    super();
    this.state = {

    }
    this.doLogout = this.doLogout.bind(this)
    this.userAction = this.userAction.bind(this)
  }
  componentDidMount() {

  }
  // 登出
  doLogout(obj) {
    if (obj.key === 'logOut') { this.props.doLogout() }
  }
  //
  userAction() {
    this.props.userAction();
  }
  render() {
    return (
      <div>
        {!this.props.isLogin ?
          <Menu mode="horizontal" className="register-login" onClick={this.userAction}>
            <Menu.Item key="loginRegister">
              <Icon type="user" />注册/登录
            </Menu.Item>
          </Menu> :

          <Menu mode="horizontal" selectedKeys={[]} onClick={this.doLogout}>
            <Menu.Item key="user">
              <Link to="/user-center">
                <Button type="primary" className="user">{this.props.nickName}</Button>
                <Icon type="user" />个人中心
              </Link>
            </Menu.Item>
            <Menu.Item key="logOut" onClick={this.doLogout} >
              <Icon type="appstore" />退出
            </Menu.Item>
          </Menu>
        }
      </div>
    )
  }
}
export default UserStatus;
UserStatus.propTypes = {
  doLogout: PropTypes.func.isRequired,
  isLogin: PropTypes.bool,
  nickName: PropTypes.string,
  userAction: PropTypes.func.isRequired,
}
